<!--

  内容区资金管理
  
-->

<template>
    <div class="contain">
     <el-row >
  
                   <el-button type="primary"
                    plain class="aa"
                    
                     >现金初始额</el-button>
                   <el-button type="success" plain>银行初始余额</el-button>
                   <el-button type="info" plain>现金日记账</el-button>
                   <el-button type="warning" plain>银行日记账</el-button>
                   <el-button type="danger" plain>借款单</el-button>
                   <el-button type="warning" plain>费用报销单</el-button>
                   
 </el-row>
 <div class="tu">
            <img   class="z1" src="../../assets/green/four-black.png" />
             <img   class="z1 z2 " src="../../assets/green/four-gray.png" />
              <img   class="z1 z3" src="../../assets/green/four-green.png" />
               <img   class="z1 z4" src="../../assets/green/four-black.png" />
               <img   class="z1 z5" src="../../assets/green/four-gray.png" />
                <img   class="j1" src="../../assets/green/jiantou-left.png" />
                 <img   class="j2" src="../../assets/green/hengxian.png" />
                 <img   class="j2 j11" src="../../assets/green/hengxian.png" />
                  <img   class="j1 j3" src="../../assets/green/jiantou-right.png" />

                 <Fontsize title="收款单" distance="21%"  km="23%" />
    <Fontsize title="其他收款单" distance="21%"  km="65.5%"/>
    <Fontsize title="往来报销" distance="44.5%" km="44.5%"/>
    <Fontsize title="付款单" distance="67.5%" km="23%"/> 
     <Fontsize title="其他付款单" distance="67.5%" km="65.5%"/> 
    </div>
    </div>
   
</template>

<script>
import Fontsize from '../Fontsize'
export default {
     components:{
        Fontsize
    }
}
</script>

<style lang="scss" scoped>
    .contain{
        height: 100%;
    }
    .aa{
        margin-left:60px
    }
  .el-button{
       margin-top: 20px;
    color: #b0b0b0;
    background: #5a5a5a;
    border-color: #5a5a5a;
        transition: 1.1s;
   }
   .tu{
    position: relative;
    height: 88%;
    width: 68%;
    }
    .j1{
             position: absolute;
    top:26%;
    left: 34%;
    height: 45.87%;
    width: 3.814%;
    }
    .j2{
    position: absolute;
    top: 48%;
    left: 37.6%;
    height: 1.09%;
    width: 3.18%;
    }
    .j11{
        left: 56.8%;
    }
    .j3{
        left: 59.8%;
    }
    .z1{
        position: absolute;
        top:15%;
        left: 18%;
        height: 25.216%;
    width: 14.891%;
    cursor: pointer;
    }
    .z2{
           top:58%;
    }
    .z3{
        top: 37%;
        left: 41.5%;
    }
    .z4{
         left: 64.5%;
    }
    .z5{
         top:58%;
         left: 64.5%;
    }
</style>
